import { BasicColumn } from '/@/components/Table';
import { FormSchema } from '/@/components/Table';
import { getPaperGetUnitTree } from '/@/api/flowManage/flowManage';
import { getDirTreeOpened } from '/@/api/process/process';
import { dateUtil as dayjs } from '/@/utils/dateUtil';

export const byOptions = [{ value: 'title', label: '标题' }];

export const columns: BasicColumn[] = [
  {
    title: 'ID',
    dataIndex: 'id',
    width: 100,
    ellipsis: true,
    resizable: true,
  },
  {
    title: '等级',
    dataIndex: 'level',
    width: 80,
    ellipsis: true,
    resizable: true,
    slots: {
      customRender: 'level',
    },
  },
  {
    title: '标题',
    dataIndex: 'title',
    width: 120,
    ellipsis: true,
    resizable: true,
  },
  {
    title: '收到时间',
    dataIndex: 'receiveDate',
    width: 160,
    ellipsis: true,
    resizable: true,
    customRender: ({ text }) => {
      if (text) {
        return dayjs(text).format('MM-DD HH:mm');
      }
    },
  },
  {
    title: '处理时间',
    dataIndex: 'checkDate',
    width: 160,
    ellipsis: true,
    resizable: true,
    customRender: ({ text }) => {
      if (text) {
        return dayjs(text).format('MM-DD HH:mm');
      }
    },
  },
  {
    title: '到期时间',
    dataIndex: 'expireDate',
    width: 150,
    ellipsis: true,
    resizable: true,
  },
  {
    title: '处理者',
    dataIndex: 'processor',
    width: 150,
    ellipsis: true,
    resizable: true,
  },
  {
    title: '发起人',
    dataIndex: 'realName',
    width: 150,
    ellipsis: true,
    resizable: true,
  },
  {
    title: '到达状态',
    dataIndex: 'status',
    width: 150,
    ellipsis: true,
    resizable: true,
  },
];

export const searchFormSchema: FormSchema[] = [
  {
    field: 'typeCode',
    label: '类型',
    component: 'ApiTreeSelect',
    colProps: { span: 8 },
    componentProps: {
      api: getDirTreeOpened,
      fieldNames: { label: 'name', value: 'code' },
      showSearch: true,
      treeNodeFilterProp: 'name',
      treeDefaultExpandAll: true,
      getPopupContainer: () => document.body,
    },
  },
  {
    field: 'by',
    label: '类别',
    component: 'Input',
    colProps: { span: 8 },
    slot: 'by',
    componentProps: {
      defaultValue: 'title',
    },
  },
];

export const formSchema: FormSchema[] = [
  {
    field: 'proxyUserRealName',
    label: '代理人',
    required: true,
    component: 'SelectUserInput',
    helpMessage: '注意：将代理人设置为空将清除代理',
    colProps: { span: 24 },
    componentProps: ({ formModel }) => {
      formModel['hadProxyUserRealNameUsers'] = [];
      if (formModel['proxyUserRealName']) {
        const realNames = formModel['proxyUserRealName']?.split(',');
        const userNames = formModel['userName']?.split(',');
        realNames?.forEach((item, index) => {
          formModel['hadProxyUserRealNameUsers'].push({
            key: userNames[index],
            name: userNames[index],
            title: item,
            realName: item,
          });
        });
      }
      return {
        type: 0,
        value: formModel.proxyUserRealName,
        hadUsers: formModel['hadProxyUserRealNameUsers'],
        isClear: true,
        onChange: (value, node) => {
          console.log('value', value, node);
          if (value) {
            const { dataRef } = node;
            formModel.userName = dataRef.userNames;
          } else {
            formModel.userName = '';
          }
          console.log('userName', formModel.userName);
        },
      };
    },
  },
  {
    field: 'starter_param_show', //starter_param id
    label: '流程发起人所在部门',
    helpMessage: '(如果未设置部门，则表示为默认代理)',
    component: 'ApiTreeSelect',
    colProps: { span: 24 },
    componentProps: async ({ schema, tableAction, formActionType, formModel }) => {
      const treeData = await getPaperGetUnitTree();
      return {
        treeData,
        fieldNames: { label: 'name', value: 'code' },
        showSearch: true,
        multiple: true,
        treeNodeFilterProp: 'name',
        treeDefaultExpandAll: true,
        onChange: (value, record) => {
          console.log('value,e', value, record);
          formModel['oldUserName'] = record.dataRef.userNames || '';
          console.log({ schema, tableAction, formActionType, formModel });
        },
      };
    },
  },
  {
    field: 'flow_code',
    label: '流程类型',
    required: true,
    component: 'Select',
    colProps: { span: 24 },
    componentProps: async () => {
      const data = (await getDirTreeOpened()) || [];
      const treeData = setChildren(data);
      return {
        treeData,
        fieldNames: { label: 'name', value: 'code' },
        showSearch: true,
        treeNodeFilterProp: 'name',
        treeDefaultExpandAll: true,
        getPopupContainer: () => document.body,
      };
    },
  },
  {
    field: '[proxyBeginDate, proxyEndDate]',
    label: '发起/结束时间',
    required: true,
    component: 'RangePicker',
    colProps: { span: 24 },
    componentProps: {
      format: 'YYYY-MM-DD HH:mm:ss',
      valueForamt: 'YYYY-MM-DD HH:mm:ss',
      placeholder: ['开始时间', '结束时间'],
      showTime: { format: 'HH:mm:ss' },
      getPopupContainer: () => document.body,
    },
  },
  {
    field: 'userRealNames',
    label: '提醒相关人员',
    required: true,
    component: 'SelectUserInput',
    colProps: { span: 24 },
    componentProps: ({ formModel }) => {
      formModel['hadUsers'] = [];
      if (formModel['userRealNames']) {
        const realNames = formModel['userRealNames']?.split(',');
        const userNames = formModel['users']?.split(',');
        realNames?.forEach((item, index) => {
          formModel['hadUsers'].push({
            key: userNames[index],
            name: userNames[index],
            title: item,
            realName: item,
          });
        });
      }
      return {
        value: formModel.userRealNames,
        hadUsers: formModel['hadUsers'],
        isClear: true,
        onChange: (value, node) => {
          console.log('value', value, node);
          if (value) {
            const { dataRef } = node;
            formModel.users = dataRef.userNames;
          } else {
            formModel.users = '';
          }
          console.log('record.userNames', formModel.users);
        },
      };
    },
  },
];

function setChildren(node) {
  node.forEach((item) => {
    item.key = item.code;
    item.value = item.code;
    item.title = item.name;
    item.disabled = item.layer == 3 ? false : true;
    if (item.children && Array.isArray(item.children) && item.children.length > 0) {
      item.isLeaf = false;
      setChildren(item.children);
    } else {
      item.isLeaf = true;
    }
  });
  return node;
}
